<!DOCTYPE html>
<html lang="zh">
<head>
  <meta charset="UTF-8" />
  <title>个人信息</title>
  <style>
    body {
      font-family: sans-serif;
      margin: 40px auto;
      max-width: 400px;
      text-align: center;
    }
    #info {
      margin: 20px 0;
      padding: 10px;
      border: 1px solid #ddd;
      border-radius: 8px;
      background: #f9f9f9;
    }
  </style>
</head>
<body>
<h2>个人信息</h2>
<div id="info">加载中...</div>
<a href="/">返回首页</a>

<script>
  const token = localStorage.getItem('token');

  if (!token) {
    // 没有 token，说明未登录
    window.location.href = '/login.html';
  } else {
    fetch('/api/me', {
      headers: {
        'Authorization': 'Bearer ' + token
      }
    })
      .then(res => {
        if (res.status === 401) {
          // token 失效或错误
          window.location.href = '/login.html';
        }
        return res.json();
      })
      .then(user => {
        document.getElementById('info').innerHTML = `
          <strong>用户名：</strong>${user.username}<br>
          <strong>邮箱：</strong>${user.email || '未填写'}
        `;
      })
      .catch(() => {
        document.getElementById('info').textContent = '加载失败，请稍后重试。';
      });
  }
</script>
</body>
</html>
